<!-- Created by henian.xu on 2017/7/3 0003. -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>layout</title>
    <link rel="stylesheet" href="../../static/css/app.css">
</head>
<body>
<div class="x-layout fixed">
    <div class="x-layout-header">header</div>
    <div class="x-layout-footer">footer</div>
    <div class="x-layout">
        <div class="x-layout-sider">sider</div>
        <div class="x-layout-content">
            <div>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
            </div>
        </div>
    </div>
</div>
<div>-------------------我是分割线--------------------------</div>
<div class="x-layout fixed">
    <div class="x-layout-sider">sider</div>
    <div class="x-layout">
        <div class="x-layout-header">header</div>
        <div class="x-layout-footer">footer</div>
        <div class="x-layout-content">
            <div>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
            </div>
        </div>
    </div>
</div>
<div>-------------------我是分割线--------------------------</div>
<div class="x-layout">
    <div class="x-layout-header">header</div>
    <div class="x-layout">
        <div class="x-layout-sider right">sider</div>
        <div class="x-layout-content">
            <div>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
            </div>
        </div>
    </div>
    <div class="x-layout-footer">footer</div>
</div>
<div>-------------------我是分割线--------------------------</div>
<div class="x-layout">
    <div class="x-layout-sider right">sider</div>
    <div class="x-layout">
        <div class="x-layout-header">header</div>
        <div class="x-layout-content">
            <div>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
                <p>content</p>
            </div>
        </div>
        <div class="x-layout-footer">footer</div>
    </div>
</div>
</body>
</html>
